<script src="/vue.js"></script>

<div id="app">
    <button @click="add">添加</button>
    <button @click="del">删除</button>
    <table>
        <tr>
            <th>编号</th>
            <th>姓名</th>
            <th>性别</th>
            <th>年龄</th>
        </tr>
        <tr v-for="item in student">
            <td>{{item.cord}}</td>
            <td>{{item.name}}</td>
            <td>{{item.sex}}</td>
            <td>{{item.age}}</td>
        </tr>
    </table>
</div>

<script>
    var vm = new Vue({
        el: "#app",
        data: {
            student: []
        },
        methods: {
            add() {
                var stu = {
                    cord: "01",
                    name: "张三",
                    sex: "男",
                    age: "20"
                }

                this.student.push(stu);
            },

            del() {
                this.student.pop();
            }
        }
    })
</script>

<style>
    table,
    th,
    tr,
    td {
        border: 1px solid black;
    }
</style>